@extends('master')


@section('title', $product->name)
<link rel="stylesheet" href="/css/swiper.min.css">

@section('content')
    <div class="page bk_content" style="top:0">
    <div class="swiper-container">
        <div class="swiper-wrapper">
            {{--轮播图--}}
            @foreach($pdt_images as $img)
            <div class="swiper-slide">
                <img class="img_resposive" style="text-align: center" src="{{$img->image_path}}" alt="">
            </div>
            @endforeach
        </div>
        <!-- 如果需要分页器 -->
        <div class="swiper-pagination"></div>

        <!-- 如果需要导航按钮 -->

        <!-- 如果需要滚动条 -->
    </div>
<div class="weui_cells_title">
    <span class="bk_title">{{$product->name}}</span>
    <span class="bk_price">￥ {{$product->price}}</span>
</div>
    <div class="weui_cells">
        <div class="weui_cell">
            <p class="bk_summary">{{$product->summary}}</p>
        </div>
    </div>

    <div class="weui_cells_title">详细介绍</div>
    <div class="weui_cells">
        <div class="well_cell">
            @if($pdt_content != null)
                {!! $pdt_content->content  !!}
            @else
                暂无内容
            @endif
        </div>
    </div>
    </div>

    <div class="bk_fix_bottom">
        <div class="bk_half_area">
            <button class="weui_btn weui_btn_primary" onclick="addCart();">加入购物车</button>
        </div>
        <div class="bk_half_area">
            <button class="weui_btn weui_btn_default" onclick="toCart()">结算(<span id="cart_num" class="m3_price">{{$count}}</span>)</button>
        </div>
    </div>
@endsection

@section('my-js')
    <script src="/js/swiper.min.js"> </script>
    <script>
    var mySwiper = new Swiper ('.swiper-container', {
    direction: 'horizontal', // 垂直切换选项
    loop: true, // 循环模式选项

    // 如果需要分页器
    pagination: {
    el: '.swiper-pagination',
    },

    // 如果需要前进后退按钮
    navigation: {
    nextEl: '.swiper-button-next',
    prevEl: '.swiper-button-prev',
    },

    // 如果需要滚动条
    //scrollbar: {
    //el: '.swiper-scrollbar',
    //},
    })

    function addCart(){
        var product_id = "{{$product->id}}";
        console.log(product_id);
        $.ajax({
            type: "GET",
            url: '/service/cart/add/'+product_id,
            dataType: 'json',
            cache: false,
            success: function (data) {
                if (data == null) {
                    $('.bk_toptips').show();
                    $('.bk_toptips span').html('服务端错误');
                    setTimeout(function () {
                        $('.bk_toptips').hide();
                    }, 2000);
                    return;
                }
                if (data.status != 0) {
                    $('.bk_toptips').show();
                    $('.bk_toptips span').html(data.message);
                    setTimeout(function () {
                        $('.bk_toptips').hide();
                    }, 2000);
                    return;
                }

                var num = $('#cart_num').html();
                if(num == '') num = 0;
                $('#cart_num').html(Number(num) + 1);

            },
            error: function (xhr, status, error) {
                console.log(xhr);
                console.log(status);
                console.log(error);
            }
        });
    }

    function toCart() {
        location.href='/cart';
    }
    </script>
@endsection
